{{extend 'layout.html'}}

<script type="text/javascript">
  $(function(){
    $("div#books").hover(
      function () {
	$("div span#preview_books").fadeIn("slow");
      },
      function () {
	$("div span#preview_books").fadeOut("fast");
      })
  });
  $(function(){
    $("div#icons").hover(
      function () {
	$("div span#preview_icons").fadeIn("slow");
      },
      function () {
	$("div span#preview_icons").fadeOut("fast");
      })
  });
</script>

<div style="float:left; width:40%;">
  <div id="books" class="loading">
    <span>
      <a href="{{=URL(r=request,c='book',f='index',args=['abc'])}}"><img src={{=URL(r=request,c='static',f='abc.png')}} /></a>
    </span>
  </div>
  <div id="preview_books" class="loading">
    <span id="preview_books" style="display:none;">
      This is the first book for children, depicting the alphabet with animals.<br />
      I hope that you will like it.
    </span>
  </div>
  <div id="icons" class="loading">
    <span>
      <a href="{{=URL(r=request,c='icons',f='index')}}"><img src={{=URL(r=request,c='static',f='icons.png')}} /></a>
    </span>
  </div>
  <div id="preview_icons" class="loading">
    <span id="preview_icons" style="display:none;">
      Please expect this project soon.
    </span>
  </div>
</div>
<div class="home" style="float:right; width:40%;">
  Welcome to my website.
  Here you will find some of my projects, related to graphic design.<br />
  Have a nice time!
</div>